<script>
    let data = {
        name: '李雷',
        age: 12,
        person: {
            nickname: 123
        }
    }

    //声明两个函数

    // 一个叫做 defineReactive

    // 另一个叫做Observer


    function defineReactive(obj) {
        Object.keys(obj).forEach(key => {
            //对key进行属性劫持
            Observer(obj, key, obj[key])
        })
    }


    //Observer

    function Observer(obj, key, value) {
        Object.defineProperty(obj, key, {
            configurable: true,
            enumerable: true,
            get() {
                //属性被访问的时候触发
                console.log(`${key}被访问了`)
                return value
            },
            set(newVal) {
                console.log(`${key}被赋值了`)
                value = newVal
            }
        })
    }
    defineReactive(data)

    console.log(data)
</script>